<template>
  <!--添加 start-->
  <el-dialog
      draggable
      destroy-on-close
      v-model="dialogAddVisible"
      title="添加"
      width="80%"
      center>
    <el-form inline :model="addFormInfo" label-width="50px">
      <el-form-item label="日期">
        <el-date-picker value-format="x" type="date" v-model="addFormInfo.wardRoundRecordTime"></el-date-picker>
      </el-form-item>
      <el-form-item label="宣教内容">
        <el-input type="textarea" rows="6" v-model="addFormInfo.wardRoundRecordContent"></el-input>
      </el-form-item>
      <el-form-item label="患者反馈">
        <el-input type="textarea" rows="6" v-model="addFormInfo.wardRoundRecordFeedBack"></el-input>
      </el-form-item>
      <el-form-item label="病房号">
        <el-input v-model="addFormInfo.wardRoundRecordNumber"></el-input>
      </el-form-item>
    </el-form>
    <template #footer>
            <span class="dialog-footer">
                <el-button @click="dialogAddVisible = false">取消</el-button>
                <el-button type="primary" @click="sureHandler">确定</el-button>
            </span>
    </template>
  </el-dialog>
  <!--添加 end-->
  <TopNav title="营养查房"/>
  <div class="container">
    <!--列表 start-->
    <div class="record-list" v-for="(item,index) in dataList.list" :key="index">
      <el-card class="record-item">
        <p><span>日期:</span>{{ detaFormater(Number(item.wardRoundRecordTime)) }}</p>
        <p><span>宣教内容:</span>{{ item.wardRoundRecordContent }}</p>
        <p><span>患者反馈:</span>{{ item.wardRoundRecordFeedBack }}</p>
        <p><span>病房号:</span>{{ item.wardRoundRecordNumber }}</p>
      </el-card>
    </div>
    <!--列表 end-->
    <!--新增按钮 start-->
    <el-icon @click="addHander" class="add-button">
      <DocumentAdd/>
    </el-icon>
    <!--新增按钮 end-->
  </div>
</template>

<script setup>
import {useDataStore} from "@/stores/dataStore.js";
import {useRoute, useRouter} from 'vue-router'
import TopNav from "@/components/TopNav/Back.vue"
import patientAxios from "@/api/patient.js"
import {onMounted, reactive, ref} from "vue";
import {detaFormater} from "@/utils/utils.js"

const route = useRoute()
//route.params.name;
const router = useRouter()
const dataStore = useDataStore()
//初始化分页查询数据
const dataList = reactive({
  list: []
})
//初始化总条数
const totalData = ref(0)
//当前页
const currentPage = ref(1)
//初始化分页显示条数
const defaultPageSize = ref(10)
//搜索初始化状态
const searchInfo = ref("")
//添加添加对话框控制器
const dialogAddVisible = ref(false)
//初始化添加对话框状态
const addFormInfo = reactive({
  wardRoundRecordTime: "",
  wardRoundRecordContent: "",
  wardRoundRecordFeedBack: "",
  wardRoundRecordNumber: "",
})
//编辑对话框控制器
const dialogEditorVisible = ref(false)
//初始化编辑对话框状态
const editorFormInfo = reactive({
  wardRoundRecordId: '',
  wardRoundRecordTime: "",
  wardRoundRecordContent: "",
  wardRoundRecordFeedBack: "",
  wardRoundRecordNumber: "",
})
/**
 * 网路请求：分页查询
 *  */
const http = () => {
  patientAxios.wardRoundRecord_search({
    search: searchInfo.value,
    page: currentPage.value,
    size: defaultPageSize.value
  }).then(res => {
    if (res.data.code == 200) {
      dataList.list = res.data.data.records
      totalData.value = res.data.data.total
    } else {
      ElMessage.error(res.data.message)
    }
  })
}
onMounted(() => {
  http()
})
/**
 * 分页
 */
const currentChangeHaddler = (nowPage) => {
  currentPage.value = nowPage
  http()
}
/**
 * 搜索按钮
 */
const searchHandle = () => {
  http()
}
/**
 * 添加对话框弹出事件
 */
const addHander = () => {
  dialogAddVisible.value = true
}
/**
 * 添加对话框 确定事件
 */
const sureHandler = () => {
  patientAxios.wardRoundRecord_add({
    wardRoundRecordTime: addFormInfo.wardRoundRecordTime,
    wardRoundRecordContent: addFormInfo.wardRoundRecordContent,
    wardRoundRecordFeedBack: addFormInfo.wardRoundRecordFeedBack,
    wardRoundRecordNumber: addFormInfo.wardRoundRecordNumber,
  }).then(res => {
    if (res.data.code == 200) {
      dialogAddVisible.value = false
      http()
    } else {
      ElMessage.error(res.data.message)
    }
  })
}
/**
 * 编辑对话框 弹出事件
 *  */
const handleEdit = (index, row) => {

  dialogEditorVisible.value = true
  patientAxios.wardRoundRecord_findById({
    wardRoundRecordId: row.wardRoundRecordId
  }).then(res => {
    if (res.data.code == 200) {
      editorFormInfo.wardRoundRecordId = res.data.data.wardRoundRecordId;
      editorFormInfo.wardRoundRecordTime = res.data.data.wardRoundRecordTime;
      editorFormInfo.wardRoundRecordContent = res.data.data.wardRoundRecordContent;
      editorFormInfo.wardRoundRecordFeedBack = res.data.data.wardRoundRecordFeedBack;
      editorFormInfo.wardRoundRecordNumber = res.data.data.wardRoundRecordNumber;
    } else {
      ElMessage.error(res.data.data.message)
    }
  })

}
/**
 * 编辑对话框 确定事件
 */
const sureEditorHandler = () => {
  patientAxios.wardRoundRecord_update({
    wardRoundRecordId: editorFormInfo.wardRoundRecordId,
    wardRoundRecordTime: editorFormInfo.wardRoundRecordTime,
    wardRoundRecordContent: editorFormInfo.wardRoundRecordContent,
    wardRoundRecordFeedBack: editorFormInfo.wardRoundRecordFeedBack,
    wardRoundRecordNumber: editorFormInfo.wardRoundRecordNumber,
  }).then(res => {
    if (res.data.code == 200) {
      dialogEditorVisible.value = false
      http()
    } else {
      ElMessage.error(res.data.message)
    }
  })
}
/**删除 */
const handleDelete = (index, row) => {
  ElMessageBox.confirm(
      '确定删除么',
      '删除',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }
  ).then(() => {
    patientAxios.wardRoundRecord_delete({
      wardRoundRecordId: row.wardRoundRecordId
    }).then(res => {
      if (res.data.code == 200) {
        ElMessage({
          type: 'success',
          message: "删除成功！！！",
        })
        http()
      } else {
        ElMessage({
          type: 'error',
          message: res.data.message,
        })
      }
    })
  }).catch(error => {
    ElMessage({
      type: 'info',
      message: "取消删除",
    })
  })
}


</script>

<style scoped lang="scss">
.record-list {
  .record-item {

    p {
      margin-top: 10px;
      opacity: .8;

      span {
        font-size: 16px;
        margin-right: 10px;
        font-weight: bolder;
      }
    }
  }
}

.add-button {
  position: fixed;
  top: 420px;
  right: 10px;
  font-size: 40px;
  color: #3ddadd;
}
</style>
